<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<style type="text/css">
			* {
				margin: 0;
				padding: 0;
			}
			
			li {
				list-style: none;
			}
			
			a {
				text-decoration: none;
			}
			
			.bg_header {
				height: 71px;
			}
			
			.header {
				width: 1300px;
				height: 71px;
				margin: 0 auto;
			}
			
			.header .logo {
				width: 266px;
				height: 71px;
				background: url(../img/游戏学院/游戏学院03.jpg) no-repeat left center;
				float: left;
				margin-right: 25px;
			}
			
			.header.nav {
				float: left;
			}
			
			.header li {
				height: 22px;
				float: left;
				margin-right: 50px;
				margin-top: 28px;
			}
			
			.header li a {
				color: #999999;
				display:block;
				padding-bottom: 5px;
			}
			
			.header a:hover {
				border-bottom: 2px solid #2f8cff;
			}
			
			.header a:hover {
				color: #333333;
			}
			
			.header .search {
				float: right;
				width: 229px;
				height: 30px;
				border: 2px #e5e5e5 solid;
				margin-top: 19px;
			}
			
			.search input[type="text"] {
				width: 184px;
				height: 30px;
				border: none;
				outline: none;
				float: left;
				background: #f2f2f2;
				padding-left: 15px;
			}
			
			.search input[type="submit"] {
				width: 30px;
				height: 30px;
				border: none;
				outline: none;
				background: url(../img/images/images/卧龙控股_03.jpg) no-repeat center center;
				background-color: #f2f2f2;
			}
			
			.bg_banner {
				height: 433px;
			}
			
			.banner img {
			    width:100%;
			    height: 433px;
			}
			
			.bg_list {
				height: 415px;
				background: url(../img/游戏学院/index-bg2.jpg) no-repeat;
				background-size: 100% 415px;
			}
			
			.list {
				width: 1300px;
				height: 387px;
				padding-top: 28px;
				margin: 0 auto;
			}
			
			.list .item {
				width: 1280px;
				height: 367px;
				border: 10px solid white;
			}
			
			.list .item .box1 .box2 .box3 {
				float: left;
			}
			
			.list .item .box1 {
				width: 535px;
				height: 367px;
				border-right: 10px solid white;
				background: red;
				float: left;
				position: relative;
			}
			
			.list .item .box2 {
				width: 362px;
				height: 367px;
				border-right: 10px solid white;
				background: pink;
				float: left;
			}
			
			.list .item .box3 {
				width: 362px;
				height: 367px;
				background: green;
				float: left;
			}
			
			.list .item li {
				width: 362px;
				background: url(../img/游戏学院/游戏学院09.jpg) no-repeat;
				background-size: cover;
			}
			
			.list .item .li-a {
				height: 179px;
				border-bottom: 10px solid white;
				position: relative;
			}
			
			.list .item .li-b {
				height: 178px;
				position: relative;
			}
			
			.list .item .box1 .innerbox {
				width: 535px;
				height: 48px;
				background: #313131;
				position: absolute;
				opacity: 0.8;
				bottom: 0;
			}
			
			.list .item .box1 .innerbox .bigflloatbox {
				margin: 12px 25px;
			}
			
			.list .item .box1 .innerbox .floatbox {
				float: left;
				width: 26px;
				height: 26px;
				background: deepskyblue;
				border-radius: 50%;
				text-align: center;
				line-height: 26px;
				color: white;
				margin-right: 10px;
			}
			
			.list .item .fontbox {
				width: 362px;
				height: 48px;
				background: #313131;
				position: absolute;
				opacity: 0.8;
				bottom: 0;
				text-align: center;
				line-height: 48px;
				color: white;
			}
		</style>
	</head>

	<body>
		<div class="boss">
			<div class="bg_header">
				<div class="header">
					<div class="logo"></div>
					<div class="nav">
						<ul>
							<li>
								<a href="#">首页</a>
							</li>
							<li>
								<a href="#">社区</a>
							</li>
							<li>
								<a href="#">课堂</a>
							</li>
							<li>
								<a href="#">项目</a>
							</li>
							<li>
								<a href="#">活动</a>
							</li>
							<li>
								<a href="#">峰会</a>
							</li>
						</ul>
					</div>
					<div class="search">
						<form action="http://www.baidu.com"><input type="text" class="search-text" placeholder="SEARCH" /><input type="submit" name="" id="" value="" /></form>
					</div>
				</div>
			</div>

			<div class="bg_banner">
				<div class="banner"><img src="../img/游戏学院/游戏学院_06.jpg" /></div>
			</div>

			<div class="bg_list">
				<div class="list">
					<div class="item">
						<div class="box1">
							<img src="../img/游戏学院/5bfcfe2b28793.jpg" />
							<div class="innerbox">
								<div class="bigflloatbox">
									<div class="floatbox">1</div>
									<div class="floatbox">2</div>
									<div class="floatbox">3</div>
									<div class="floatbox">4</div>
								</div>
							</div>
						</div>
						<div class="box2">
							<ul>
								<li class="li-a">
									<div class="fontbox">世界观就是剧情？不要再这样说了</div>
								</li>
								<li class="li-b">
									<div class="fontbox">世界观就是剧情？不要再这样说了</div>
								</li>
							</ul>

						</div>
						<div class="box3">
							<ul>
								<li class="li-a">
									<div class="fontbox">世界观就是剧情？不要再这样说了</div>
								</li>
								<li class="li-b">
									<div class="fontbox">世界观就是剧情？不要再这样说了</div>
								</li>
							</ul>
						</div>
					</div>
				</div>
			</div>
		</div>
	</body>

</html>